<template>
	<view>
		
		<!-- 步骤导航 -->
		<view class="grace-steps" style="margin-top:25upx; margin-left: 20upx;">
			<view class="step current">
				<view class="step-circle">1</view>
				<view class="step-content">
					<view class="step-title">完善信息</view>
				</view>
			</view>
			<view class="step current">
				<view class="step-circle">2</view>
				<view class="step-content">
					<view class="step-title">学者认领</view>
				</view>
			</view>
			<view class="step current">
				<view class="step-circle">3</view>
				<view class="step-content">
					<view class="step-title">认领完成</view>
				</view>
			</view>
		</view>
		<form @submit="formSubmit">
			<!-- 步骤内容 -->
			<view class="" style="margin: 30upx 20upx;">
				
				<view class="renling-title">
					<image src="../../../static/renzheng.png"></image>
					<text>恭喜您，认领成功！</text>
				</view>
				
				<view class="renling-link">
					<text @click="goSetting()"> >>返回个人中心</text>
					<text @click="goHomePage()"> >>我的学者主页</text>
				</view>
				
			</view>
			
			<view class="table-btn-view">
				<button type="warn" formType="submit" class="save-btn" >完成</button>
			</view>
		</form>
		
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';			
	export default {
		computed: {
			...mapState(['userInfo', 'hasLogin', 'loginProvider', 'openid'])
		},				
		data() {
			return {
				
			};
		},
		methods:{
			...mapMutations(['login', 'logout', 'setOpenid', 'setProvider']),						
			formSubmit: function(e){
				uni.switchTab({
					url: '../../tab-bar/my/my'
				})
			},
			goSetting(){
				uni.switchTab({
					url: '../../tab-bar/my/my'
				})			
			},
			goHomePage(){
				uni.navigateTo({
					url: "/pages/my/home-page/home-page?id=" + this.userInfo.id
				})
			}
		}
	}
</script>

<style>

.table-btn-view{
	/* position: fixed;
	bottom: 27upx; */
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
	
.table-btn-view .save-btn {
	margin-top: 10upx;
	width: 92%;
	height: 90upx;
	line-height: 90upx;
	background: rgba(0, 170, 255, 1);
	border-radius: 10upx;
	color: #FFFFFF;
}

.renling-title {
	margin-top: 100upx;
	display: flex;
	flex-direction: row;
	justify-content:center;
}

.renling-title image {
	width: 100upx;
	height: 100upx;
}

.renling-title text {
	font-size: 40upx;
	color: #EC6D2C;
	line-height: 100upx;
}

.renling-link {
	display: flex;
	justify-content:center;
	margin-bottom: 100upx;
}

.renling-link text {
	color: #0A98D5;
	font-size: 28upx;
	margin: 15upx;
}

</style>
